<template>
  <div class="app-container">
    <div v-if="siloList.length>0">
      <el-row :gutter="10" class="mb8" style="width: 100%;margin: 0 auto;margin-top: 50px">
        <div v-for="(silo,index) in topList" class="silo">
          <el-col :span="3">
            <el-row>
              <el-col :span="12">
                <div class="silo-name">{{siloList[silo].matterName}}</div>
                <el-tooltip effect="dark" :content="siloList[silo].weightValue+'t'" placement="top">
                  <canvas-silo :canvas-silo-id="siloList[silo].siloId" :silo-number="siloList[silo].siloCode"
                               style="cursor: pointer"
                               :title="siloList[silo].siloCode" :current="siloList[silo].weightValue"
                               :full="siloList[silo].fullWeight"
                               :min="siloList[silo].positionDown" :max="siloList[silo].positionUp"
                               :run="siloList[silo].siloStatus"/>
                </el-tooltip>
              </el-col>
              <el-col :span="12">
                <table class="operate-table" style="margin-top: 20px;width: 100%">
                  <tbody>
                  <tr>
                    <td></td>
                    <td style="font-size: 10px">仓重:</td>
                    <td>{{parseFloat(siloList[silo].weightValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td></td>
                    <td style="font-size: 10px">配比:</td>
                    <td>{{parseFloat(siloList[silo].peibiValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td rowspan="4" style="font-size: 10px;width: 15%">下料量</td>
                    <td style="font-size: 10px;width: 35%">瞬时:</td>
                    <td style="width: 50%">{{parseFloat(siloList[silo].cuttingValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td style="font-size: 10px">设定:</td>
                    <td>{{parseFloat(siloList[silo].setValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td style="font-size: 10px">偏差:</td>
                    <td>{{parseFloat(siloList[silo].pianchaValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td colspan="2"><strong>单位：t/h</strong></td>
                  </tr>

                  </tbody>
                </table>
                <table class="operate-table" style="margin-top: 30px">
                  <tr>
                    <td>
                      <el-button v-if="siloList[silo].siloStatus==0"  style="font-size: 0.8em;width: 31px;padding: 0px;color: #f11818" class="btnBG">无效</el-button>
                      <el-button v-if="siloList[silo].siloStatus==1"  style="font-size: 0.8em;width: 31px;padding: 0px;color: #1c84f5" class="btnBG">有效</el-button>
                    </td>
                    <td>
                      <el-button style="font-size: 0.8em;width: 31px;padding: 0px" @click="drawChuteChart(siloList[silo])" class="btnBG">仓重</el-button>
                    </td>
                    <td>
                      <el-button style="font-size: 0.8em;width: 36px;padding: 0px" @click="drawCuttChart(siloList[silo])" class="btnBG">下料量</el-button>
                    </td>
                  </tr>
                </table>

              </el-col>
            </el-row>
            <canvas-belt :width="80"/>
            <canvas-arrow :width="15" :angle="90"/>
            <canvas-belt :width="160"/>
          </el-col>
        </div>
      </el-row>
      <canvas-belt :width="1700" style="margin-top: 60px"/>
      <el-row :gutter="10" class="mb8" style="width: 98%;margin: 0 auto;margin-top: 50px">
        <div v-for="(silo,index) in downList" class="silo">
          <el-col style="width: 14%">
            <el-row>
              <el-col :span="12">
                <div class="silo-name">{{siloList[silo].matterName}}</div>
                <el-tooltip effect="dark" :content="siloList[silo].siloWeight+'t'" placement="top">
                  <canvas-silo @click.native="drawChuteChart($event)" :canvas-silo-id="siloList[silo].siloId"
                               :silo-number="siloList[silo].siloCode" style="cursor: pointer"
                               :title="siloList[silo].siloCode" :current="siloList[silo].weightValue"
                               :full="siloList[silo].fullWeight"
                               :min="siloList[silo].positionDown" :max="siloList[silo].positionUp"
                               :run="siloList[silo].siloStatus"/>
                </el-tooltip>
              </el-col>
              <el-col :span="12">
                <table class="operate-table" style="margin-top: 20px;width: 100%">
                  <tbody>
                  <tr>
                    <td></td>
                    <td style="font-size: 10px">仓重:</td>
                    <td>{{parseFloat(siloList[silo].weightValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td></td>
                    <td style="font-size: 10px">配比:</td>
                    <td>{{parseFloat(siloList[silo].peibiValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td rowspan="4" style="font-size: 10px;width: 15%">下料量</td>
                    <td style="font-size: 10px;width: 35%">瞬时:</td>
                    <td style="width: 50%">{{parseFloat(siloList[silo].cuttingValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td style="font-size: 10px">设定:</td>
                    <td>{{parseFloat(siloList[silo].setValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td style="font-size: 10px">偏差:</td>
                    <td>{{parseFloat(siloList[silo].pianchaValue).toFixed(2)}}</td>
                  </tr>
                  <tr>
                    <td colspan="2"><strong>单位：t/h</strong></td>
                  </tr>


                  </tbody>
                </table>
                <table class="operate-table" style="margin-top: 30px">
                  <tr>
                    <td>
                      <el-button v-if="siloList[silo].siloStatus==0"  style="font-size: 0.8em;width: 31px;padding: 0px;color: #f11818" class="btnBG">无效</el-button>
                      <el-button v-if="siloList[silo].siloStatus==1"  style="font-size: 0.8em;width: 31px;padding: 0px;color: #1c84f5" class="btnBG">有效</el-button>
                    </td>
                    <td>
                      <el-button style="font-size: 0.8em;width: 31px;padding: 0px" @click="drawChuteChart(siloList[silo])" class="btnBG">仓重</el-button>
                    </td>
                    <td>
                      <el-button style="font-size: 0.8em;width: 36px;padding: 0px" @click="drawCuttChart(siloList[silo])" class="btnBG">下料量</el-button>
                    </td>
                  </tr>
                </table>
              </el-col>
            </el-row>
            <canvas-belt :width="80"/>
            <canvas-arrow :width="15" :angle="90"/>
            <canvas-belt :width="160"/>
          </el-col>
        </div>
      </el-row>

    </div>
    <el-row :gutter="10" style="width: 100%;margin: 0 auto;margin-top: 50px">
      <el-col :span="4">
        <center>
          <el-button style="font-size: 1.5em;width: 160px;margin-top: 10px" type="primary" @click="soilClick(1)"
                     class="btnBG">料种
          </el-button>
        </center>
      </el-col>
      <el-col :span="5">
        <center>
          <el-button style="font-size: 1.5em;width: 160px;margin-top: 10px" type="primary" @click="soilClick(2)"
                     class="btnBG">仓重记录
          </el-button>
        </center>
      </el-col>
      <el-col :span="5">
        <center>
          <el-button style="font-size: 1.5em;width: 160px;margin-top: 10px" type="primary" @click="soilClick(3)"
                     class="btnBG">下料量记录
          </el-button>
        </center>
      </el-col>
      <el-col :span="5">
        <center>
          <el-button style="font-size: 1.5em;width: 180px;margin-top: 10px" type="primary" @click="soilClick(4)"
                     class="btnBG">当日生产统计
          </el-button>
        </center>
      </el-col>
      <el-col :span="5">
        <center>
          <el-button style="font-size: 1.5em;width: 180px;margin-top: 10px" type="primary" @click="soilClick(6)"
                     class="btnBG">前日生产统计
          </el-button>
        </center>
      </el-col>
    </el-row>

    <el-dialog  :visible.sync="lcxll" width="60%" append-to-body>
      <el-form :model="queryParams" ref="queryForm" :inline="true">
        <el-form-item label="时间范围" prop="searchDateRange">
          <el-date-picker clearable size="small"
                          @change="drawChuteChart(silo)"
                          v-model="queryParams.searchDateRange"
                          type="datetimerange"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          range-separator="至"
                          start-placeholder="开始时间"
                          end-placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="drawChuteChart(silo)">搜索</el-button>
        </el-form-item>
      </el-form>
      <div ref="lcxllChart" style="width: 100%;height: 600px"></div>
    </el-dialog>

    <el-dialog  :visible.sync="ssxll" width="60%" append-to-body>
      <el-form :model="queryParams" ref="queryForm" :inline="true">
        <el-form-item label="时间范围" prop="searchDateRange">
          <el-date-picker clearable size="small"
                          @change="drawCuttChart(silo)"
                          v-model="queryParams.searchDateRange"
                          type="datetimerange"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          range-separator="至"
                          start-placeholder="开始时间"
                          end-placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="drawCuttChart(silo)">搜索</el-button>
        </el-form-item>
      </el-form>
      <div ref="ssxllChart" style="width: 100%;height: 600px"></div>
    </el-dialog>


    <el-dialog title="料种" :visible.sync="lz" width="60%" append-to-body>
      <sinter-matter></sinter-matter>
    </el-dialog>


    <el-dialog title="仓重记录" :visible.sync="pbsd" width="80%" append-to-body>
      <el-form :model="queryParams" ref="queryForm" :inline="true">
        <el-form-item label="时间范围" prop="searchDateRange">
          <el-date-picker clearable size="small"
                          @change="draLczDataChart"
                          v-model="queryParams.searchDateRange"
                          type="datetimerange"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          range-separator="至"
                          start-placeholder="开始时间"
                          end-placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="draLczDataChart">搜索</el-button>
        </el-form-item>
      </el-form>
      <div ref="czjlChart" style="width: 100%;height: 600px"></div>
    </el-dialog>

    <el-dialog title="下料量记录" :visible.sync="lcjll" width="80%" append-to-body>
      <el-form :model="queryParams" ref="queryForm" :inline="true">
        <el-form-item label="时间范围" prop="searchDateRange">
          <el-date-picker clearable size="small"
                          @change="drawXll"
                          v-model="queryParams.searchDateRange"
                          type="datetimerange"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          range-separator="至"
                          start-placeholder="开始时间"
                          end-placeholder="结束时间">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="drawXll">搜索</el-button>
        </el-form-item>
      </el-form>

      <el-tabs value="tab1" @tab-click="toggleTab">
        <el-tab-pane label="瞬时下料量" name="tab1" class="fill">
          <div ref="lcjllsChart" style="width: 100%;height: 600px"></div>
      </el-tab-pane>
        <el-tab-pane label="偏差" name="tab2" class="fill">
          <div ref="lcjllpChart" style="width: 100%;height: 600px"></div>
        </el-tab-pane>
      </el-tabs>


    </el-dialog>

    <el-dialog title="当日生产统计" :visible.sync="lljl" width="60%"  append-to-body>
      <table class="dayReport-table" style="width: 100%">
        <thead>
        <tr><th colspan="17" width="100%" style="font-size: 1.5em"class="align-center">当日生产统计</th></tr>
        </thead>
        <tbody>
        <tr>
          <th style="color: #1c84f5">仓位</th>
          <th>1</th>
          <th>2</th>
          <th>3</th>
          <th>4</th>
          <th>5</th>
          <th>6</th>
          <th>7</th>
          <th>8</th>
          <th>9</th>
          <th>10</th>
          <th>11</th>
          <th>12</th>
          <th>13</th>
          <th>14</th>
          <th>15</th>
          <th rowspan="2">累计</th>
        </tr>
        <tr>
          <th style="color: #1c84f5">矿料</th>
          <th  style="color: red" v-for="(silo,index) in siloList">{{silo.matterName}}</th>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">夜班统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_night1_total.cacheValue,nowObj.st2_night2_total.cacheValue,nowObj.st2_night3_total.cacheValue,nowObj.st2_night4_total.cacheValue,
            nowObj.st2_night5_total.cacheValue,nowObj.st2_night6_total.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_night7_total.cacheValue,nowObj.st2_night8_total.cacheValue, nowObj.st2_night9_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_night10_total.cacheValue,nowObj.st2_night11_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_night12_total.cacheValue,nowObj.st2_night13_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_night14_total.cacheValue,nowObj.st2_night15_total.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_night.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_night1_total.cacheValue}}</td>
          <td>{{nowObj.st2_night2_total.cacheValue}}</td>
          <td>{{nowObj.st2_night3_total.cacheValue}}</td>
          <td>{{nowObj.st2_night4_total.cacheValue}}</td>
          <td>{{nowObj.st2_night5_total.cacheValue}}</td>
          <td>{{nowObj.st2_night6_total.cacheValue}}</td>
          <td>{{nowObj.st2_night7_total.cacheValue}}</td>
          <td>{{nowObj.st2_night8_total.cacheValue}}</td>
          <td>{{nowObj.st2_night9_total.cacheValue}}</td>
          <td>{{nowObj.st2_night10_total.cacheValue}}</td>
          <td>{{nowObj.st2_night11_total.cacheValue}}</td>
          <td>{{nowObj.st2_night12_total.cacheValue}}</td>
          <td>{{nowObj.st2_night13_total.cacheValue}}</td>
          <td>{{nowObj.st2_night14_total.cacheValue}}</td>
          <td>{{nowObj.st2_night15_total.cacheValue}}</td>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">白班统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_day1_total.cacheValue,nowObj.st2_day2_total.cacheValue,nowObj.st2_day3_total.cacheValue,nowObj.st2_day4_total.cacheValue,
            nowObj.st2_day5_total.cacheValue,nowObj.st2_day6_total.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_day7_total.cacheValue,nowObj.st2_day8_total.cacheValue, nowObj.st2_day9_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_day10_total.cacheValue,nowObj.st2_day11_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_day12_total.cacheValue,nowObj.st2_day13_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_day14_total.cacheValue,nowObj.st2_day15_total.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_day.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_day1_total.cacheValue}}</td>
          <td>{{nowObj.st2_day2_total.cacheValue}}</td>
          <td>{{nowObj.st2_day3_total.cacheValue}}</td>
          <td>{{nowObj.st2_day4_total.cacheValue}}</td>
          <td>{{nowObj.st2_day5_total.cacheValue}}</td>
          <td>{{nowObj.st2_day6_total.cacheValue}}</td>
          <td>{{nowObj.st2_day7_total.cacheValue}}</td>
          <td>{{nowObj.st2_day8_total.cacheValue}}</td>
          <td>{{nowObj.st2_day9_total.cacheValue}}</td>
          <td>{{nowObj.st2_day10_total.cacheValue}}</td>
          <td>{{nowObj.st2_day11_total.cacheValue}}</td>
          <td>{{nowObj.st2_day12_total.cacheValue}}</td>
          <td>{{nowObj.st2_day13_total.cacheValue}}</td>
          <td>{{nowObj.st2_day14_total.cacheValue}}</td>
          <td>{{nowObj.st2_day15_total.cacheValue}}</td>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">日统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_daily1_total.cacheValue,nowObj.st2_daily2_total.cacheValue,nowObj.st2_daily3_total.cacheValue,nowObj.st2_daily4_total.cacheValue,
            nowObj.st2_daily5_total.cacheValue,nowObj.st2_daily6_total.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_daily7_total.cacheValue,nowObj.st2_daily8_total.cacheValue, nowObj.st2_daily9_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_daily10_total.cacheValue,nowObj.st2_daily11_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_daily12_total.cacheValue,nowObj.st2_daily13_total.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_daily14_total.cacheValue,nowObj.st2_daily15_total.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_daily.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_daily1_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily2_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily3_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily4_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily5_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily6_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily7_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily8_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily9_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily10_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily11_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily12_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily13_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily14_total.cacheValue}}</td>
          <td>{{nowObj.st2_daily15_total.cacheValue}}</td>
        </tr>
        </tbody>
      </table>
    </el-dialog>


    <el-dialog title="前日生产统计" :visible.sync="plzl" width="60%" append-to-body>
      <table class="dayReport-table" style="width: 100%">
        <thead>
        <tr><th colspan="17" width="100%" style="font-size: 1.5em"class="align-center">前日生产统计</th></tr>
        </thead>
        <tbody>
        <tr>
          <th>仓位</th>
          <th>1</th>
          <th>2</th>
          <th>3</th>
          <th>4</th>
          <th>5</th>
          <th>6</th>
          <th>7</th>
          <th>8</th>
          <th>9</th>
          <th>10</th>
          <th>11</th>
          <th>12</th>
          <th>13</th>
          <th>14</th>
          <th>15</th>
          <th rowspan="2">累计</th>
        </tr>
        <tr>
          <th>矿料</th>
          <th style="color: red"  v-for="(silo,index) in siloList">{{silo.matterName}}</th>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">夜班统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous1_night.cacheValue,nowObj.st2_previous2_night.cacheValue,nowObj.st2_previous3_night.cacheValue,nowObj.st2_previous4_night.cacheValue,
            nowObj.st2_previous5_night.cacheValue,nowObj.st2_previous6_night.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous7_night.cacheValue,nowObj.st2_previous8_night.cacheValue, nowObj.st2_previous9_night.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous10_night.cacheValue,nowObj.st2_previous11_night.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous12_night.cacheValue,nowObj.st2_previous13_night.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous14_night.cacheValue,nowObj.st2_previous15_night.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_previous.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_previous1_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous2_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous3_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous4_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous5_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous6_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous7_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous8_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous9_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous10_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous11_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous12_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous13_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous14_night.cacheValue}}</td>
          <td>{{nowObj.st2_previous15_night.cacheValue}}</td>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">白班统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous1_day.cacheValue,nowObj.st2_previous2_day.cacheValue,nowObj.st2_previous3_day.cacheValue,nowObj.st2_previous4_day.cacheValue,
            nowObj.st2_previous5_day.cacheValue,nowObj.st2_previous6_day.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous7_day.cacheValue,nowObj.st2_previous8_day.cacheValue, nowObj.st2_previous9_day.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous10_day.cacheValue,nowObj.st2_previous11_day.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous12_day.cacheValue,nowObj.st2_previous13_day.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous14_day.cacheValue,nowObj.st2_previous15_day.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_previous_day.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_previous1_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous2_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous3_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous4_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous5_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous6_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous7_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous8_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous9_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous10_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous11_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous12_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous13_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous14_day.cacheValue}}</td>
          <td>{{nowObj.st2_previous15_day.cacheValue}}</td>
        </tr>
        <tr>
          <th rowspan="2" style="color: #1c84f5">日统计</th>
          <td colspan="6" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous1_daily.cacheValue,nowObj.st2_previous2_daily.cacheValue,nowObj.st2_previous3_daily.cacheValue,nowObj.st2_previous4_daily.cacheValue,
            nowObj.st2_previous5_daily.cacheValue,nowObj.st2_previous6_daily.cacheValue)}}</td>
          <td colspan="3" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous7_daily.cacheValue,nowObj.st2_previous8_daily.cacheValue, nowObj.st2_previous9_daily.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous10_daily.cacheValue,nowObj.st2_previous11_daily.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous12_daily.cacheValue,nowObj.st2_previous13_daily.cacheValue)}}</td>
          <td colspan="2" style="background-color:  #6e767f;color: #eeeeee">{{getSumAdd(nowObj.st2_previous14_daily.cacheValue,nowObj.st2_previous15_daily.cacheValue)}}</td>
          <td rowspan="2" style="background-color:  #6e767f;color: #eeeeee">{{nowObj.st2_all_previous_daily.cacheValue}}</td>
        </tr>
        <tr>
          <td>{{nowObj.st2_previous1_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous2_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous3_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous4_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous5_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous6_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous7_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous8_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous9_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous10_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous11_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous12_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous13_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous14_daily.cacheValue}}</td>
          <td>{{nowObj.st2_previous15_daily.cacheValue}}</td>
        </tr>
        </tbody>
      </table>
    </el-dialog>

  </div>
</template>

<script>
  import {getOptionList, getMixedAttrValue,updateInfo} from '@/api/app/silo/info'
  import CanvasSilo from './canvas/silo'
  import CanvasBelt from './canvas/belt'
  import CanvasArrow from './canvas/arrow'
  import SinterMatter from "./info/sinterMatter";
  import BatchingCalculationPage from "./info/BatchingCalculationPage";
  import * as echarts from "echarts";
  import {getDataByCode,getHisChart, getRealDataByTags} from '@/api/app/plc/cache'

  export default {
    name: "Bellows",
    components: {
      BatchingCalculationPage,
      SinterMatter,
      CanvasSilo,
      CanvasBelt,
      CanvasArrow,
    },
    data() {
      return {
        timer: null,
        siloList: [],
        queryParams: {
          searchDateRange: [this.moment().subtract('hours', 1).format('YYYY-MM-DD HH:mm:ss'), this.moment().format('YYYY-MM-DD HH:mm:ss')],
        },
        topList: [0, 1, 2, 3, 4, 5, 6, 7],
        downList: [8, 9, 10, 11, 12, 13, 14],
        lcCode: '',
        silo:{},
        lcxll: false,
        lz: false,
        pbsd: false,
        lcjll: false,
        lljl: false,
        xsjl: false,
        plzl: false,

        ssCode :'',
        ssxll:false,

        tabName:'',
        nowObj: {
          'st2_all_night':{cacheValue:0}, 'st2_night1_total':{cacheValue:0}, 'st2_night2_total':{cacheValue:0}, 'st2_night3_total':{cacheValue:0},
          'st2_night4_total':{cacheValue:0}, 'st2_night5_total':{cacheValue:0}, 'st2_night6_total':{cacheValue:0}, 'st2_night7_total':{cacheValue:0},
          'st2_night8_total':{cacheValue:0}, 'st2_night9_total':{cacheValue:0}, 'st2_night10_total':{cacheValue:0}, 'st2_night11_total':{cacheValue:0},
          'st2_night12_total':{cacheValue:0}, 'st2_night13_total':{cacheValue:0}, 'st2_night14_total':{cacheValue:0}, 'st2_night15_total':{cacheValue:0},


          'st2_all_day':{cacheValue:0}, 'st2_day1_total':{cacheValue:0}, 'st2_day2_total':{cacheValue:0}, 'st2_day3_total':{cacheValue:0},
          'st2_day4_total':{cacheValue:0}, 'st2_day5_total':{cacheValue:0}, 'st2_day6_total':{cacheValue:0}, 'st2_day7_total':{cacheValue:0},
          'st2_day8_total':{cacheValue:0}, 'st2_day9_total':{cacheValue:0}, 'st2_day10_total':{cacheValue:0}, 'st2_day11_total':{cacheValue:0},
          'st2_day12_total':{cacheValue:0}, 'st2_day13_total':{cacheValue:0}, 'st2_day14_total':{cacheValue:0}, 'st2_day15_total':{cacheValue:0},

          'st2_all_daily':{cacheValue:0}, 'st2_daily1_total':{cacheValue:0}, 'st2_daily2_total':{cacheValue:0}, 'st2_daily3_total':{cacheValue:0},
          'st2_daily4_total':{cacheValue:0}, 'st2_daily5_total':{cacheValue:0}, 'st2_daily6_total':{cacheValue:0}, 'st2_daily7_total':{cacheValue:0},
          'st2_daily8_total':{cacheValue:0}, 'st2_daily9_total':{cacheValue:0}, 'st2_daily10_total':{cacheValue:0}, 'st2_daily11_total':{cacheValue:0},
          'st2_daily12_total':{cacheValue:0}, 'st2_daily13_total':{cacheValue:0}, 'st2_daily14_total':{cacheValue:0}, 'st2_daily15_total':{cacheValue:0},

          'st2_previous1_night':{cacheValue:0}, 'st2_previous2_night':{cacheValue:0}, 'st2_previous3_night':{cacheValue:0}, 'st2_previous4_night':{cacheValue:0},
          'st2_previous5_night':{cacheValue:0}, 'st2_previous6_night':{cacheValue:0}, 'st2_previous7_night':{cacheValue:0}, 'st2_previous8_night':{cacheValue:0},
          'st2_previous9_night':{cacheValue:0}, 'st2_previous10_night':{cacheValue:0}, 'st2_previous11_night':{cacheValue:0}, 'st2_previous12_night':{cacheValue:0},
          'st2_previous13_night':{cacheValue:0}, 'st2_previous14_night':{cacheValue:0}, 'st2_previous15_night':{cacheValue:0}, 'st2_all_previous':{cacheValue:0},

          'st2_previous1_day':{cacheValue:0}, 'st2_previous2_day':{cacheValue:0}, 'st2_previous3_day':{cacheValue:0}, 'st2_previous4_day':{cacheValue:0},
          'st2_previous5_day':{cacheValue:0}, 'st2_previous6_day':{cacheValue:0}, 'st2_previous7_day':{cacheValue:0}, 'st2_previous8_day':{cacheValue:0},
          'st2_previous9_day':{cacheValue:0}, 'st2_previous10_day':{cacheValue:0}, 'st2_previous11_day':{cacheValue:0}, 'st2_previous12_day':{cacheValue:0},
          'st2_previous13_day':{cacheValue:0}, 'st2_previous14_day':{cacheValue:0}, 'st2_previous15_day':{cacheValue:0}, 'st2_all_previous_day':{cacheValue:0},

          'st2_previous1_daily':{cacheValue:0},'st2_all_previous_daily':{cacheValue:0}, 'st2_previous2_daily':{cacheValue:0}, 'st2_previous3_daily':{cacheValue:0},
          'st2_previous4_daily':{cacheValue:0}, 'st2_previous5_daily':{cacheValue:0}, 'st2_previous6_daily':{cacheValue:0}, 'st2_previous7_daily':{cacheValue:0},
          'st2_previous8_daily':{cacheValue:0}, 'st2_previous9_daily':{cacheValue:0}, 'st2_previous10_daily':{cacheValue:0}, 'st2_previous11_daily':{cacheValue:0},
          'st2_previous12_daily':{cacheValue:0}, 'st2_previous13_daily':{cacheValue:0}, 'st2_previous14_daily':{cacheValue:0}, 'st2_previous15_daily':{cacheValue:0},



        },
      };
    },
    created() {
      this.getList();
      this.timer = setInterval(() => {
        this.getList()
      }, 3000)
    },
    destroyed() {
      clearInterval(this.timer)
    },
    methods: {
      /** 查询风箱列表 */
      getList() {
        getOptionList({area:2}).then(response => {
          this.siloList = response.data.rows
        })
      },

      soilClick(type) {
        if (type == 1) {
          this.pbsd = false
          this.lcjll = false
          this.lljl = false
          this.xsjl = false
          this.plzl = false
          if (this.lz == true) {
            this.lz = false
          } else {
            this.lz = true
          }
        } else if (type == 2) {
          this.lz = false
          this.lcjll = false
          this.lljl = false
          this.xsjl = false
          this.plzl = false
          if (this.pbsd == true) {
            this.pbsd = false
          } else {
            this.pbsd = true
            this.draLczDataChart()
          }
        } else if (type == 3) {
          this.lz = false
          this.pbsd = false
          this.lljl = false
          this.xsjl = false
          this.plzl = false
          if (this.lcjll == true) {
            this.lcjll = false
          } else {
            this.lcjll = true
            this.draLJwDataChart()
          }
        } else if (type == 4) {
          this.lz = false
          this.pbsd = false
          this.lcjll = false
          this.xsjl = false
          this.plzl = false
          if (this.lljl == true) {
            this.lljl = false
          } else {
            this.lljl = true
            this.draLSsDataChart()
          }
        } else if (type == 5) {
          this.lz = false
          this.pbsd = false
          this.lcjll = false
          this.lljl = false
          this.plzl = false
          if (this.xsjl == true) {
            this.xsjl = false
          } else {
            this.xsjl = true
          }
        } else if (type == 6) {
          this.lz = false
          this.pbsd = false
          this.lcjll = false
          this.lljl = false
          this.xsjl = false
          if (this.plzl == true) {
            this.plzl = false
          } else {
            this.drawPlzlChart()
            this.plzl = true
          }
        }
      },
      //料仓重量
      draLczDataChart(){
        if (this.queryParams.searchDateRange) {
          let data = {
            timeTag: 1,
            startDt: this.queryParams.searchDateRange[0],
            endDt: this.queryParams.searchDateRange[1]
          }
          data.codes =
          "st2_bin_weight1" + "," + "st2_bin_weight2" + "," + "st2_bin_weight3" + "," + "st2_bin_weight4" + "," + "st2_bin_weight5" + "," + "st2_bin_weight6" + "," +
          "st2_bin_weight7" + "," + "st2_bin_weight8" + "," + "st2_bin_weight9" + "," + "st2_bin_weight10" + "," + "st2_bin_weight11" + "," + "st2_bin_weight12" + "," + "st2_bin_weight13" + "," + "st2_bin_weight14" + "," + "st2_bin_weight15"
          let colorList = ['#fc8251', '#5470c6', '#9A60B4', '#ef5699', '#f9c956', '#AA069F', '#FD0100', '#FC7D02', '#93CE07', '#E76264', '#B473D2', '#724488', '#9A60B4', '#B94F51', '#9A60B4']
          getHisChart(data).then(response => {
            this.$nextTick(() => {
              let eList = response.data
              let series = []
              let list1 = [], list2 = [], list3 = [], list4 = [], list5 = [], list6 = [], list7 = [], list8 = [],
                list9 = [], list10 = [], list11 = [], list12 = [], list13 = [], list14 = [], list15 = []
              let nameList = [], xdata = []
              //名称
              nameList.push(eList[0].name)
              nameList.push(eList[1].name)
              nameList.push(eList[2].name)
              nameList.push(eList[3].name)
              nameList.push(eList[4].name)
              nameList.push(eList[5].name)
              nameList.push(eList[6].name)
              nameList.push(eList[7].name)
              nameList.push(eList[8].name)
              nameList.push(eList[9].name)
              nameList.push(eList[10].name)
              nameList.push(eList[11].name)
              nameList.push(eList[12].name)
              nameList.push(eList[13].name)
              nameList.push(eList[14].name)
              //数据
              for (let a = 0; a < eList[0].list.length; a++) {
                xdata.push(eList[0].list[a].dt)
                list1.push(eList[0].list[a].value)
                list2.push(eList[1].list[a].value)
                list3.push(eList[2].list[a].value)
                list4.push(eList[3].list[a].value)
                list5.push(eList[4].list[a].value)
                list6.push(eList[5].list[a].value)
                list7.push(eList[6].list[a].value)
                list8.push(eList[7].list[a].value)
                list9.push(eList[8].list[a].value)
                list10.push(eList[9].list[a].value)
                list11.push(eList[10].list[a].value)
                list12.push(eList[11].list[a].value)
                list13.push(eList[12].list[a].value)
                list14.push(eList[13].list[a].value)
                list15.push(eList[14].list[a].value)
              }
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[0],
                data: list1,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[0]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[1],
                data: list2,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[1]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[2],
                data: list3,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[2]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[3],
                data: list4,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[3]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[4],
                data: list5,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[4]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[5],
                data: list6,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[5]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[6],
                data: list7,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[6]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[7],
                data: list8,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[7]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[8],
                data: list9,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[8]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[9],
                data: list10,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[9]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[10],
                data: list11,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[10]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[11],
                data: list12,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[11]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[12],
                data: list13,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[12]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[13],
                data: list14,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[13]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[14],
                data: list15,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[14]}
              })


              let chart = echarts.init(this.$refs.czjlChart, 'light')
              let option = {
                grid: {
                  left: 60,
                  right: 60,
                  bottom: 20,
                  containLabel: true
                },
                "backgroundColor": "rgba(0, 0, 0, 0)",
                dataZoom: {
                  type: 'inside',
                  zoomOnMouseWheel: true,
                },
                xAxis: {
                  type: 'category',
                  data: xdata,
                },
                yAxis: [{
                  name: '料仓重量',
                  type: 'value',
                  splitLine: {
                    lineStyle: {
                      type: 'dotted',
                      //color: ['#aaa', '#ddd']
                    }
                  },
                  axisLabel: {
                    textStyle: {
                      color: '#000'
                    },
                  },
                  min: function (val) {
                    return parseInt(val.min - 20)
                  },
                  max: function (val) {
                    return parseInt(val.max + 20)
                  },
                }],
                tooltip: {
                  trigger: 'axis', //设置tip提示
                  axisPointer: { // 坐标轴指示器，坐标轴触发有效
                    type: 'line' // 默认为直线，可选为：'line' | 'shadow'
                  }
                },
                legend: [ {
                  x:'center',
                  data:['1#料仓料重','2#料仓料重','3#料仓料重','4#料仓料重','5#料仓料重','6#料仓料重','7#料仓料重'],
                },
                  {
                    x:'center',
                    top:'3%',
                    data:['8#料仓料重', '9#料仓料重','10#料仓料重','11#料仓料重','12#料仓料重','13#料仓料重','14#料仓料重','15#料仓料重'],
                  }],



                series: series
              }
              chart.setOption(option, true)
            })
          })
        }
      },
      //下料量记录
      draLJwDataChart() {
        if (this.queryParams.searchDateRange) {
          let data = {
            timeTag: 1,
            startDt: this.queryParams.searchDateRange[0],
            endDt: this.queryParams.searchDateRange[1]
          }
          data.codes =
          "st2_bin_flow1" + "," + "st2_bin_flow2" + "," + "st2_bin_flow3" + "," + "st2_bin_flow4" + "," + "st2_bin_flow5" + "," + "st2_bin_flow6" + "," + "st2_bin_flow7" + "," + "st2_bin_flow8" + "," +
          "st2_bin_flow9" + "," + "st2_bin_flow10" + "," + "st2_bin_flow11" + "," + "st2_bin_flow12" + "," + "st2_bin_flow13" + "," + "st2_bin_flow14" + "," + "st2_bin_flow15"
          let colorList = ['#fc8251', '#5470c6', '#9A60B4', '#ef6567', '#f9c956', '#AA069F', '#FD0100', '#FC7D02', '#93CE07', '#E76264', '#B473D2', '#724488', '#9A60B4', '#B94F51', '#FC8251']
          getHisChart(data).then(response => {
            this.$nextTick(() => {
              let eList = response.data
              let series = []
              let list1 = [], list2 = [], list3 = [], list4 = [], list5 = [], list6 = [], list7 = [], list8 = [],
                list9 = [], list10 = [], list11 = [], list12 = [], list13 = [], list14 = [], list15 = [],
                list16 = [], list17 = [], list18 = [], list19 = [], list20 = [], list21 = [], list22 = [], list23 = [], list24 = [],
                list25 = [], list26 = [], list27 = [], list28 = [], list29 = [], list30 = []
              let nameList = [], xdata = []
              //名称
              nameList.push(eList[0].name)
              nameList.push(eList[1].name)
              nameList.push(eList[2].name)
              nameList.push(eList[3].name)
              nameList.push(eList[4].name)
              nameList.push(eList[5].name)
              nameList.push(eList[6].name)
              nameList.push(eList[7].name)
              nameList.push(eList[8].name)
              nameList.push(eList[9].name)
              nameList.push(eList[10].name)
              nameList.push(eList[11].name)
              nameList.push(eList[12].name)
              nameList.push(eList[13].name)
              nameList.push(eList[14].name)

              //数据
              for (let a = 0; a < eList[0].list.length; a++) {
                xdata.push(eList[0].list[a].dt)
                list1.push(eList[0].list[a].value)
                list2.push(eList[1].list[a].value)
                list3.push(eList[2].list[a].value)
                list4.push(eList[3].list[a].value)
                list5.push(eList[4].list[a].value)
                list6.push(eList[5].list[a].value)
                list7.push(eList[6].list[a].value)
                list8.push(eList[7].list[a].value)
                list9.push(eList[8].list[a].value)
                list10.push(eList[9].list[a].value)
                list11.push(eList[10].list[a].value)
                list12.push(eList[11].list[a].value)
                list13.push(eList[12].list[a].value)
                list14.push(eList[13].list[a].value)
                list15.push(eList[14].list[a].value)

                /*list16.push(eList[15].list[a].value)
                list17.push(eList[16].list[a].value)
                list18.push(eList[17].list[a].value)
                list19.push(eList[18].list[a].value)
                list20.push(eList[19].list[a].value)
                list21.push(eList[20].list[a].value)
                list22.push(eList[21].list[a].value)
                list23.push(eList[22].list[a].value)
                list24.push(eList[23].list[a].value)
                list25.push(eList[24].list[a].value)
                list26.push(eList[25].list[a].value)
                list27.push(eList[26].list[a].value)
                list28.push(eList[27].list[a].value)
                list29.push(eList[28].list[a].value)
                list30.push(eList[29].list[a].value)*/

              }
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[0],
                data: list1,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[0]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[1],
                data: list2,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[1]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[2],
                data: list3,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[2]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[3],
                data: list4,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[3]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[4],
                data: list5,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[4]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[5],
                data: list6,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[5]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[6],
                data: list7,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[6]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[7],
                data: list8,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[7]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[8],
                data: list9,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[8]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[9],
                data: list10,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[9]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[10],
                data: list11,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[10]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[11],
                data: list12,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[11]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[12],
                data: list13,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[12]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[13],
                data: list14,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[13]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[14],
                data: list15,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[14]}
              })



              let chart = echarts.init(this.$refs.lcjllsChart, 'light')
              let option = {
                grid: {
                  left: 60,
                  right: 60,
                  bottom: 20,
                  containLabel: true
                },
                "backgroundColor": "rgba(0, 0, 0, 0)",
                dataZoom: {
                  type: 'inside',
                  zoomOnMouseWheel: true,
                },
                xAxis: {
                  type: 'category',
                  data: xdata,
                },
                yAxis: [{
                  name: '瞬时下料量',
                  type: 'value',
                  splitLine: {
                    lineStyle: {
                      type: 'dotted',
                      //color: ['#aaa', '#ddd']
                    }
                  },
                  axisLabel: {
                    textStyle: {
                      color: '#000'
                    },
                  },
                  min: function (val) {
                    return parseInt(val.min - 10)
                  },
                  max: function (val) {
                    return parseInt(val.max + 10)
                  },
                }],
                tooltip: {
                  trigger: 'axis', //设置tip提示
                  axisPointer: { // 坐标轴指示器，坐标轴触发有效
                    type: 'line' // 默认为直线，可选为：'line' | 'shadow'
                  }
                },
                legend: [ {
                  x:'center',
                  data:['1#料仓配料秤料流量','2#料仓配料秤料流量','3#料仓配料秤料流量','4#料仓配料秤料流量','5#料仓配料秤料流量','6#料仓配料秤料流量','7#料仓配料秤料流量'],
                },
                  {
                    x:'center',
                    top:'3%',
                    data:['8#料仓配料秤料流量', '9#料仓配料秤料流量','10#料仓配料秤料流量','11#料仓配料秤料流量','12#料仓配料秤料流量','13#料仓配料秤料流量','14#料仓配料秤料流量','15#料仓配料秤料流量'],
                  }],
                series: series
              }
              chart.setOption(option, true)
            })
          })
        }
      },
      //偏差
      draPcChart() {
        if (this.queryParams.searchDateRange) {
          let data = {
            timeTag: 1,
            startDt: this.queryParams.searchDateRange[0],
            endDt: this.queryParams.searchDateRange[1]
          }
          data.codes =
          "st2_dev1_bin" + "," + "st2_dev2_bin" + "," + "st2_dev3_bin" + "," + "st2_dev4_bin" + "," + "st2_dev5_bin" + "," + "st2_dev6_bin" + "," + "st2_dev7_bin" + "," + "st2_dev8_bin" + "," +
          "st2_dev9_bin" + "," + "st2_dev10_bin" + "," + "st2_dev11_bin" + "," + "st2_dev12_bin" + "," + "st2_dev13_bin" + "," + "st2_dev14_bin" + "," + "st2_dev15_bin"
          let colorList = ['#fc8251', '#5470c6', '#9A60B4', '#ef6567', '#f9c956', '#AA069F', '#FD0100', '#FC7D02', '#93CE07', '#E76264', '#B473D2', '#724488', '#9A60B4', '#B94F51', '#FC8251']
          getHisChart(data).then(response => {
            this.$nextTick(() => {
              let eList = response.data
              let series = []
              let list1 = [], list2 = [], list3 = [], list4 = [], list5 = [], list6 = [], list7 = [], list8 = [],
                list9 = [], list10 = [], list11 = [], list12 = [], list13 = [], list14 = [], list15 = [],
                list16 = [], list17 = [], list18 = [], list19 = [], list20 = [], list21 = [], list22 = [], list23 = [], list24 = [],
                list25 = [], list26 = [], list27 = [], list28 = [], list29 = [], list30 = []
              let nameList = [], xdata = []
              //名称
              nameList.push(eList[0].name)
              nameList.push(eList[1].name)
              nameList.push(eList[2].name)
              nameList.push(eList[3].name)
              nameList.push(eList[4].name)
              nameList.push(eList[5].name)
              nameList.push(eList[6].name)
              nameList.push(eList[7].name)
              nameList.push(eList[8].name)
              nameList.push(eList[9].name)
              nameList.push(eList[10].name)
              nameList.push(eList[11].name)
              nameList.push(eList[12].name)
              nameList.push(eList[13].name)
              nameList.push(eList[14].name)

              //数据
              for (let a = 0; a < eList[0].list.length; a++) {
                xdata.push(eList[0].list[a].dt)
                list1.push(eList[0].list[a].value)
                list2.push(eList[1].list[a].value)
                list3.push(eList[2].list[a].value)
                list4.push(eList[3].list[a].value)
                list5.push(eList[4].list[a].value)
                list6.push(eList[5].list[a].value)
                list7.push(eList[6].list[a].value)
                list8.push(eList[7].list[a].value)
                list9.push(eList[8].list[a].value)
                list10.push(eList[9].list[a].value)
                list11.push(eList[10].list[a].value)
                list12.push(eList[11].list[a].value)
                list13.push(eList[12].list[a].value)
                list14.push(eList[13].list[a].value)
                list15.push(eList[14].list[a].value)


              }
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[0],
                data: list1,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[0]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[1],
                data: list2,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[1]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[2],
                data: list3,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[2]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[3],
                data: list4,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[3]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[4],
                data: list5,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[4]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[5],
                data: list6,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[5]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[6],
                data: list7,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[6]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[7],
                data: list8,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[7]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[8],
                data: list9,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[8]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[9],
                data: list10,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[9]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[10],
                data: list11,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[10]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[11],
                data: list12,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[11]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[12],
                data: list13,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[12]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[13],
                data: list14,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[13]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[14],
                data: list15,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[14]}
              })



              let chart = echarts.init(this.$refs.lcjllpChart, 'light')
              let option = {
                grid: {
                  left: 60,
                  right: 60,
                  bottom: 20,
                  containLabel: true
                },
                "backgroundColor": "rgba(0, 0, 0, 0)",
                dataZoom: {
                  type: 'inside',
                  zoomOnMouseWheel: true,
                },
                xAxis: {
                  type: 'category',
                  data: xdata,
                },
                yAxis: [{
                  name: '偏差值',
                  type: 'value',
                  splitLine: {
                    lineStyle: {
                      type: 'dotted',
                      //color: ['#aaa', '#ddd']
                    }
                  },
                  axisLabel: {
                    textStyle: {
                      color: '#000'
                    },
                  },
                  min: function (val) {
                    return parseInt(val.min - 5)
                  },
                  max: function (val) {
                    return parseInt(val.max + 5)
                  },
                }],
                tooltip: {
                  trigger: 'axis', //设置tip提示
                  axisPointer: { // 坐标轴指示器，坐标轴触发有效
                    type: 'line' // 默认为直线，可选为：'line' | 'shadow'
                  }
                },
                legend: [ {
                  x:'center',
                  data:['1#配料仓下料偏差','2#配料仓下料偏差','3#配料仓下料偏差','4#配料仓下料偏差','5#配料仓下料偏差','6#配料仓下料偏差','7#配料仓下料偏差'],
                },
                  {
                    x:'center',
                    top:'3%',
                    data:['8#配料仓下料偏差', '9#配料仓下料偏差','10#配料仓下料偏差','11#配料仓下料偏差','12#配料仓下料偏差','13#配料仓下料偏差','14#配料仓下料偏差','15#配料仓下料偏差'],
                  }],
                series: series
              }
              chart.setOption(option, true)
            })
          })
        }
      },

      drawXll(){
        if(this.tabName == 'tab2'){this.draPcChart()}else{this.draLJwDataChart()}
      },


      toggleTab(tab, event) {
        if (tab.name == 'tab2') {
          this.draPcChart()
          this.tabName = 'tab2'
        }else {
          this.draLJwDataChart()
          this.tabName = 'tab1'
        }
      },


      //当日生产统计
      draLSsDataChart() {
        let _that =this
        let tempData = [
          'st2_all_night','st2_night1_total', 'st2_night2_total', 'st2_night3_total',
          'st2_night4_total', 'st2_night5_total', 'st2_night6_total', 'st2_night7_total',
          'st2_night8_total', 'st2_night9_total', 'st2_night10_total', 'st2_night11_total',
          'st2_night12_total', 'st2_night13_total', 'st2_night14_total', 'st2_night15_total',

          'st2_all_day','st2_day1_total', 'st2_day2_total', 'st2_day3_total',
          'st2_day4_total', 'st2_day5_total', 'st2_day6_total', 'st2_day7_total',
          'st2_day8_total', 'st2_day9_total', 'st2_day10_total', 'st2_day11_total',
          'st2_day12_total', 'st2_day13_total', 'st2_day14_total', 'st2_day15_total',

          'st2_all_daily', 'st2_daily1_total', 'st2_daily2_total', 'st2_daily3_total',
          'st2_daily4_total', 'st2_daily5_total', 'st2_daily6_total', 'st2_daily7_total',
          'st2_daily8_total', 'st2_daily9_total', 'st2_daily10_total', 'st2_daily11_total',
          'st2_daily12_total', 'st2_daily13_total', 'st2_daily14_total', 'st2_daily15_total',

        ]
        var arr2 = JSON.stringify(tempData)
        getDataByCode({json: arr2}).then(res => {
          Object.keys(res.data).forEach(key=>{
            _that.nowObj[key].cacheValue= res.data[key].cacheValue
          })
        })
      },
      //前日生产统计
      drawPlzlChart(){
        let _that =this
        let tempData = [
          'st2_previous1_night','st2_previous2_night','st2_previous3_night','st2_previous4_night',
          'st2_previous5_night', 'st2_previous6_night','st2_previous7_night','st2_previous8_night',
          'st2_previous9_night','st2_previous10_night', 'st2_previous11_night','st2_previous12_night',
          'st2_previous13_night','st2_previous14_night','st2_previous15_night','st2_all_previous',

          'st2_previous1_day','st2_previous2_day','st2_previous3_day','st2_previous4_day',
          'st2_previous5_day','st2_previous6_day','st2_previous7_day','st2_previous8_day',
          'st2_previous9_day','st2_previous10_day','st2_previous11_day','st2_previous12_day',
          'st2_previous13_day','st2_previous14_day','st2_previous15_day','st2_all_previous_day',

          'st2_previous1_daily', 'st2_previous2_daily', 'st2_previous3_daily', 'st2_previous4_daily',
          'st2_previous5_daily', 'st2_previous6_daily', 'st2_previous7_daily', 'st2_previous8_daily',
          'st2_previous9_daily', 'st2_previous10_daily', 'st2_previous11_daily', 'st2_previous12_daily',
          'st2_previous13_daily', 'st2_previous14_daily', 'st2_previous15_daily', 'st2_all_previous_daily',

        ]
        var arr2 = JSON.stringify(tempData)
        getDataByCode({json: arr2}).then(res => {
          Object.keys(res.data).forEach(key=>{
            _that.nowObj[key].cacheValue= res.data[key].cacheValue
          })
        })
      },

      getSumAdd(a, b, c, d, e, f, g, h, i,k,l,m,n,o,p) {
        let res=0
        if (a)res += parseFloat(a)
        if (b) res += parseFloat(b)
        if (c) res += parseFloat(c)
        if (d) res += parseFloat(d)
        if (e) res += parseFloat(e)
        if (f) res += parseFloat(f)
        if (g) res += parseFloat(g)
        if (h) res += parseFloat(h)
        if (i) res += parseFloat(i)
        if (k) res += parseFloat(k)
        if (l) res += parseFloat(l)
        if (m) res += parseFloat(m)
        if (n) res += parseFloat(n)
        if (o) res += parseFloat(o)
        if (p) res += parseFloat(p)
        return res
      },

      soilWClick(silo,index) {
        if(silo.siloStatus==0){
          this.$confirm('确认要启用"' + silo.siloCode + '"料仓吗?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function () {
            silo.siloStatus =1
            return updateInfo(silo)
          }).then(() => {
            this.msgSuccess( "启用成功");
            // this.getList()
            this.siloList[index].siloStatus=1
          }).catch(function () {
          });
        }
        if(silo.siloStatus==1){
          this.$confirm('确认要停用"' + silo.siloCode + '"料仓吗?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function () {
            silo.siloStatus =0
            return updateInfo(silo)
          }).then(() => {
            this.msgSuccess( "停用成功");
            // this.getList()
            this.siloList[index].siloStatus=0
          }).catch(function () {
          });
        }
      },

      drawChuteChart(silo) {
        this.lcxll = true
        this.silo = silo
        this.ssCode = silo.siloCode + "仓量"
        if (this.queryParams.searchDateRange) {
          let data = {
            timeTag: 1,
            startDt: this.queryParams.searchDateRange[0],
            endDt: this.queryParams.searchDateRange[1]
          }
          data.codes = silo.weightCode
          let colorList = ['#fc8251', '#5470c6', '#9A60B4', '#ef6567', '#f9c956', '#AA069F', '#FD0100', '#FC7D02', '#93CE07', '#E76264', '#B473D2', '#724488', '#9A60B4', '#B94F51', '#FC8251']
          getHisChart(data).then(response => {
            this.$nextTick(() => {
              let eList = response.data
              let series = []
              let list1 = [], list2 = [], list3 = [], list4 = [], nameList = [], xdata = []
              //第一条数据
              nameList.push(eList[0].name)
              for (let a = 0; a < eList[0].list.length; a++) {
                list1.push(eList[0].list[a].value)
                xdata.push(eList[0].list[a].dt)
              }
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[0],
                data: list1,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[0]}
              })

              let chart = echarts.init(this.$refs.lcxllChart, 'light')
              let option = {
                /** 保存echart图片 **/
                toolbox: {
                  show: true,
                  feature: {
                    saveAsImage: {
                      show: true,
                      excludeComponents: ['toolbox'],
                      pixelRatio: 2
                    }
                  }
                },
                grid: {
                  left: 60,
                  right: 60,
                  bottom: 20,
                  containLabel: true
                },
                "backgroundColor": "rgba(0, 0, 0, 0)",
                dataZoom: {
                  type: 'inside',
                  zoomOnMouseWheel: true,
                },
                xAxis: {
                  type: 'category',
                  data: xdata,
                },
                yAxis: [{
                  name: '仓重',
                  type: 'value',
                  splitLine: {
                    lineStyle: {
                      type: 'dotted',
                      //color: ['#aaa', '#ddd']
                    }
                  },
                  axisLabel: {
                    textStyle: {
                      color: '#000'
                    },
                  },
                  min: function (val) {
                    return parseInt(val.min - 20)
                  },
                  max: function (val) {
                    return parseInt(val.max + 20)
                  },
                },],
                tooltip: {
                  trigger: 'axis', //设置tip提示
                  axisPointer: { // 坐标轴指示器，坐标轴触发有效
                    type: 'line' // 默认为直线，可选为：'line' | 'shadow'
                  }
                },
                legend: {
                  left: 'center',
                },
                series: series
              }
              chart.setOption(option, true)
            })
          })
        }
      },

      drawCuttChart(silo){
        this.ssxll = true
        this.silo = silo
        this.lcCode = silo.siloCode + "下料量"
        if (this.queryParams.searchDateRange) {
          let data = {
            timeTag: 1,
            startDt: this.queryParams.searchDateRange[0],
            endDt: this.queryParams.searchDateRange[1]
          }
          data.codes = silo.cuttingCode+","+silo.pianchaCode
          let colorList = ['#fc8251', '#5470c6', '#9A60B4', '#ef6567', '#f9c956', '#AA069F', '#FD0100', '#FC7D02', '#93CE07', '#E76264', '#B473D2', '#724488', '#9A60B4', '#B94F51', '#FC8251']
          getHisChart(data).then(response => {
            this.$nextTick(() => {
              let eList = response.data
              let series = []
              let list1 = [], list2 = [], list3 = [], list4 = [], nameList = [], xdata = []
              //第一条数据
              nameList.push(eList[0].name)
              nameList.push(eList[1].name)
              for (let a = 0; a < eList[0].list.length; a++) {
                xdata.push(eList[0].list[a].dt)
                list1.push(parseFloat(eList[0].list[a].value).toFixed(2))
                list2.push(parseFloat(eList[1].list[a].value).toFixed(2))
              }
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[0],
                data: list1,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[0]}
              })
              series.push({
                showSymbol: false,
                yAxisIndex: 0,
                name: nameList[1],
                data: list2,
                type: 'line',
                smooth: true,
                itemStyle: {color: colorList[2]}
              })

              let chart = echarts.init(this.$refs.ssxllChart, 'light')
              let option = {
                /** 保存echart图片 **/
                toolbox: {
                  show: true,
                  feature: {
                    saveAsImage: {
                      show: true,
                      excludeComponents: ['toolbox'],
                      pixelRatio: 2
                    }
                  }
                },
                grid: {
                  left: 60,
                  right: 60,
                  bottom: 20,
                  containLabel: true
                },
                "backgroundColor": "rgba(0, 0, 0, 0)",
                dataZoom: {
                  type: 'inside',
                  zoomOnMouseWheel: true,
                },
                xAxis: {
                  type: 'category',
                  data: xdata,
                },
                yAxis: [{
                  name: '仓下料量',
                  type: 'value',
                  splitLine: {
                    lineStyle: {
                      type: 'dotted',
                      //color: ['#aaa', '#ddd']
                    }
                  },
                  axisLabel: {
                    textStyle: {
                      color: '#000'
                    },
                  },
                  min: function (val) {
                    return parseInt(val.min - 20)
                  },
                  max: function (val) {
                    return parseInt(val.max + 20)
                  },
                },],
                tooltip: {
                  trigger: 'axis', //设置tip提示
                  axisPointer: { // 坐标轴指示器，坐标轴触发有效
                    type: 'line' // 默认为直线，可选为：'line' | 'shadow'
                  }
                },
                legend: {
                  left: 'center',
                },
                series: series
              }
              chart.setOption(option, true)
            })
          })
        }
      },

    }
  };
</script>
<style scoped>

  .dayReport-table {
    width: 100%;
    border-collapse: collapse;
  }

  .dayReport-table th {
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #cccccc;
    font-size: 15px;
  }

  .dayReport-table td {
    padding: 10px 5px;
    text-align: center;
    border: 1px solid #cccccc;
    font-size: 15px;
  }


  .dayReport-table th.align-right, .dayReport-table td.align-right {
    text-align: right;
  }



  .operate-table {
    float: right;
    border-collapse: collapse;
    width: 100%;
    display: inline-block;
    font-size: 15px;
  }

  .operate-table td {
    font-weight: bold;
    text-align: center;
    font-size: 15px;
    color: #1e1e1e;
    border: 1px solid #C1DAD7;
  }

  .operate-table el-table__cell {
    padding: 0;
  }

  .silo {
    margin: 0 auto;
  }

  .silo-name {
    text-align: center;
    border: 1px solid #999999;
    padding: 5px 0;
    margin-bottom: 10px;
    width: 82px;
  }

  .silo-cutting {
    text-align: center;
    border: 1px solid #999999;
    padding: 5px 0;
    margin-top: 5px;
  }
</style>
